<template>
  <div class="cont">
    <div class="list">
      <span>{{label}}</span>
      <div
        v-for="(item,index) in switchType"
        :key="index"
        v-show="item.key === key"
      >
        <i-switch
          v-if="item.key === key"
          :value="item.value === 'Y' ? true : false "
          @change="onChange(item)"
          slot="footer"
        ></i-switch>
      </div>
    </div>
  </div>
</template>

<script>
import { FIND_SHOP_CONFIG_API, UPDATE_SHOP_MARKETING_API } from '@/api'

export default {
  components: {},
  data () {
    return {
      label: '',
      key: '',
      queryType: {
        DIS: '信贷服务',
        REPAY: '布谷还款',
        RECEIPT: '布谷收款'
      },
      switchType: [
        {
          key: 'DIS',
          getKey: 'isDis',
          value: 'Y'
        },
        {
          key: 'REPAY',
          getKey: 'isRepay',
          value: 'Y'
        },
        {
          key: 'RECEIPT',
          getKey: 'isReceipt',
          value: 'Y'
        }
      ]
    }
  },
  created () {},
  computed: {
    account () {
      return this.$cookie.get('account')
    }
  },
  onShow () {
    this.updateTitle()
    this._getDataState()
  },
  methods: {
    onChange (item) {
      if (item.value === 'Y') {
        item.value = 'N'
      } else {
        item.value = 'Y'
      }
      this._updateMarketing(item)
    },
    _updateMarketing (item) {
      const vm = this
      let params = {
        shopId: vm.account.shopId,
        // TO DO
        // 忘了之前有没有改过了
        // [item.getKey]: item.value,
        status: item.value,
        marketingType: item.key
      }
      UPDATE_SHOP_MARKETING_API(params)
        .then(r => {
          if (r.data.code === '0') {
            vm.$toast(`${vm.label}开关状态修改成功`)
          } else {
            vm.$toast(r.data.message)
          }
        })
        .catch(e => {
          console.info(e)
        })
    },
    updateTitle () {
      const vm = this
      let query = vm.$root.$mp.query
      for (let key in vm.queryType) {
        if (key === query.type) {
          vm.label = vm.queryType[key]
          vm.key = key
          wx.setNavigationBarTitle({
            title: vm.queryType[key]
          })
        }
      }
    },
    _getDataState () {
      const vm = this
      FIND_SHOP_CONFIG_API(vm.account.shopId)
        .then(r => {
          if (r.data.code === '0') {
            vm.switchType.forEach(_ => {
              if (_.key === vm.key) {
                _.value = r.data.data[_.getKey]
              }
            })
          } else {
            vm.$toast(r.data.message)
          }
        })
        .catch(e => {
          console.info(e)
        })
    }
  }
}
</script>

<style lang="scss">
.cont {
  width: 100%;
  background: #eef2f5;
  .list {
    width: 100%;
    padding: 15px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    span {
      font-size: 14px;
      margin-left: 30px;
    }
    div {
      margin-right: 30px;
    }
  }
}
</style>
